<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <style>
        #divId {
            width: 300px;
            height: 300px;
        }

        #divId > li {
            list-style: none;
            width: 30.33333%;
            height: 30.3333%;
            float: left;
            background: #9fa596;
            margin: 2px;
            text-align: center;
        }

        .liId{
            font-size: 30px;
            color: #f0b60f;
        }
    </style>
    <script src="../../jquery-js/jquery.js"></script>
    <script>
        $(function () {
            // alert($('a').attr('target'));

            $('a').attr({
                target: '_blank',
                href: 'https://www.bilibili.com'
            });

            // alert($('a').attr('target'));

            $('#btn1').click(function () {
                $('#checked').attr('checked', true);
            });

            $('#btn2').click(function () {
                $('#checked').attr('checked', false);
            });

            $('#btn3').click(function () {
               $('#divId>li').toggleClass('liId');
            });
        })
    </script>
</head>
<body>
<div id="divId">
    <li>1</li>
    <li>2</li>
    <li>3</li>
    <li>4</li>
    <li>5</li>
    <li>6</li>
    <li>7</li>
    <li>8</li>
    <li>9</li>
</div>
<br><br>
<input type="button" id="btn3" value="点击切换字体样式">
<a href="https://www.baidu.com" target="_parent">百度</a>
<br><br>
<input type="checkbox" id="checked">
<input type="button" id="btn1" value="选中">
<input type="button" id="btn2" value="反选">
</body>
</html>